import {
    Component,
    ElementRef,
    EventEmitter,
    Input,
    OnChanges,
    OnInit,
    Output,
    SimpleChange,
    ViewChild
  } from '@angular/core';
  import { ScriptLoader } from '../providers/scriptLoader';
  import { MapService } from '../providers/mapService';
  import { nullCheck } from '../helpers/validate';
  import { TMapInstance, MapOptions } from '../types/Map';

  @Component({
    providers: [ScriptLoader],
    selector: 'tianditu-map',
    styleUrls: [
        './tmap.component.css'
    ],
    templateUrl: './tmap.component.html'
  })
  export class MapComponent implements OnInit, OnChanges {

    @Input() private options: MapOptions;

    @Output() private loaded = new EventEmitter();
    @Output() private clicked = new EventEmitter();
    @ViewChild('mapinstance') private mapInstance: ElementRef;
    constructor(private _service: MapService) {}
    public ngOnInit() {
     this._service.createMap(this.mapInstance.nativeElement, this.options)
        .then(map => {
            console.log('创建map成功');
            this.loaded.emit(map);
            return map;
        })
        .then( map => {
          this.addListener(map);
        });
    }
    public ngOnChanges(changes: { [propertyName: string]: SimpleChange }) {
     // const opts = changes.options.currentValue as MapOptions;
     // this._service.setOptions(opts);
    }

    private addListener(map: TMapInstance) {
      map.addEventListener('click', (e: any) => {
        this.clicked.emit(e);
      });
    }
}
